var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
    return new (P || (P = Promise))(function (resolve, reject) {
        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
        function step(result) { result.done ? resolve(result.value) : new P(function (resolve) { resolve(result.value); }).then(fulfilled, rejected); }
        step((generator = generator.apply(thisArg, _arguments || [])).next());
    });
};
define(["require", "exports", "admin/services/shopping", "myWuZhui", "dilu", "react", "react-dom"], function (require, exports, shopping_1, wz, dilu_1, React, ReactDOM) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    function default_1(page) {
        let shopping = page.createService(shopping_1.ShoppingService);
        class SolutionListPage extends React.Component {
            constructor(props) {
                super(props);
                this.items = new Array();
            }
            componentDidMount() {
                let dataSource = this.dataSource = new wuzhui.DataSource({
                    select: () => shopping.freightSolutions(),
                    delete: (dataItem) => shopping.deleteFreightSolution(dataItem),
                    update: (dataItem) => shopping.updateFreightSolution(dataItem),
                    insert: (dataItem) => shopping.addFreightSolution(dataItem),
                    primaryKeys: ['Id']
                });
                dataSource.selected.add((sender, result) => {
                    this.items = result.dataItems;
                });
                let it = this;
                let gridView = wz.createGridView({
                    element: this.gridViewElement,
                    columns: [
                        new wz.BoundField({
                            dataField: 'Id', headerText: '编号',
                            headerStyle: { width: '300px' }
                        }),
                        new wz.BoundField({
                            dataField: 'Name', headerText: '名称',
                        }),
                        new wz.CustomField({
                            createItemCell(dataItem) {
                                let cell = new IsDefaultCell(it, dataItem);
                                return cell;
                            },
                            itemStyle: { textAlign: 'center', width: '100px' },
                            headerText: '是否默认'
                        }),
                        new wz.CustomField({
                            createItemCell(dataItem) {
                                let cell = new wuzhui.GridViewCell();
                                ReactDOM.render(h("div", null,
                                    h("button", { className: "btn btn-info btn-minier", style: { marginRight: 4 }, onClick: () => it.showDialog(dataItem) },
                                        h("i", { className: "icon-pencil" })),
                                    h("button", { className: "btn btn-minier btn-danger", style: { marginRight: 4 }, ref: (e) => {
                                            if (!e)
                                                return;
                                            e.onclick = ui.buttonOnClick(() => dataSource.delete(dataItem), { confirm: `确定要删除'${dataItem.Name}'运费方案吗` });
                                        } },
                                        h("i", { className: "icon-trash" })),
                                    h("a", { className: "btn btn-info btn-minier", style: { marginRight: 4 }, href: `#freight_freightList?id=${dataItem.Id}&name=${encodeURI(dataItem.Name)}` }, "\u8BBE\u7F6E\u8FD0\u8D39")), cell.element);
                                return cell;
                            },
                            headerText: '操作',
                            headerStyle: { width: '180px' },
                            itemStyle: { textAlign: 'center' },
                        })
                    ],
                    dataSource,
                    pageSize: null
                });
            }
            showDialog(dataItem) {
                let name = dataItem ? dataItem.Name : '';
                let defaultFreight;
                let title = dataItem ? '编辑运费模板' : '添加运费模板';
                let fields = [
                    { name: 'name', rules: [dilu_1.rules.required('请输入运费模板名称')] },
                ];
                if (!dataItem) {
                    fields.push({ name: 'freight', rules: [dilu_1.rules.required('请输入默认运费')] });
                }
                this.validator = new dilu_1.FormValidator(this.dialogElement, ...fields);
                ReactDOM.render(h("div", { className: "modal-dialog" },
                    h("div", { className: "modal-content" },
                        h("div", { className: "modal-header" },
                            h("button", { type: "button", className: "close", "data-dismiss": "modal" },
                                h("span", { "aria-hidden": "true" }, "\u00D7"),
                                h("span", { className: "sr-only" }, "Close")),
                            h("h4", { "data-bind": "text:title", className: "modal-title" }, title)),
                        h("div", { className: "modal-body form-horizontal" },
                            h("div", { className: "form-group" },
                                h("label", { className: "col-sm-2 control-label" }, "\u540D\u79F0"),
                                h("div", { className: "col-sm-10" },
                                    h("input", { name: "name", type: "text", className: "form-control", placeholder: "\u8BF7\u8F93\u5165\u8FD0\u8D39\u6A21\u677F\u7684\u540D\u79F0", ref: (e) => {
                                            if (!e)
                                                return;
                                            e.value = name || '';
                                        }, onChange: (e) => name = e.target.value }))),
                            dataItem == null ? h("div", { className: "form-group" },
                                h("label", { className: "col-sm-2 control-label" }, "\u9ED8\u8BA4\u8FD0\u8D39"),
                                h("div", { className: "col-sm-10" },
                                    h("input", { name: "freight", type: "text", className: "form-control", placeholder: "\u5728\u6A21\u677F\u4E0B\uFF0C\u9002\u7528\u4E8E\u5927\u90E8\u5206\u5730\u533A\u7684\u8FD0\u8D39", onChange: (e) => defaultFreight = Number.parseFloat(e.target.value) }))) : null,
                            h("div", { className: "modal-footer" },
                                h("button", { name: "btn_cancel", type: "button", className: "btn btn-default", "data-dismiss": "modal" }, "\u53D6\u6D88"),
                                h("button", { name: "btn_confirm", type: "button", className: "btn btn-primary", ref: (e) => {
                                        if (!e)
                                            return;
                                        ui.buttonOnClick(e, () => __awaiter(this, void 0, void 0, function* () {
                                            let isValid = yield this.validator.check();
                                            if (!isValid) {
                                                return Promise.reject('Valid fail.');
                                            }
                                            if (dataItem) {
                                                dataItem.Name = name;
                                                this.dataSource.update(dataItem).then(() => {
                                                    ui.hideDialog(this.dialogElement);
                                                });
                                            }
                                            else {
                                                let freightElement = this.dialogElement.querySelector('[name="freight"]');
                                                dataItem = {
                                                    Name: name, IsDefault: false,
                                                    defaultFreight: Number.parseFloat(freightElement.value)
                                                };
                                                this.dataSource.insert(dataItem).then(() => {
                                                    ui.hideDialog(this.dialogElement);
                                                });
                                            }
                                        }));
                                    } }, "\u786E\u8BA4"))))), this.dialogElement);
                ui.showDialog(this.dialogElement);
            }
            render() {
                return (h("div", null,
                    h("div", { id: "news", className: "tabbable" },
                        h("ul", { id: "myTab", className: "nav nav-tabs" },
                            h("li", { className: "pull-right" },
                                h("button", { "data-bind": "click:newItem", className: "btn btn-primary btn-sm", onClick: () => this.showDialog() },
                                    h("i", { className: "icon-plus" }),
                                    h("span", null, "\u65B0\u5EFA\u8FD0\u8D39\u6A21\u677F"))))),
                    h("table", { ref: (e) => this.gridViewElement = e || this.gridViewElement }),
                    h("div", { className: "modal fade", ref: (e) => this.dialogElement = e || this.dialogElement })));
            }
        }
        ReactDOM.render(h(SolutionListPage, null), page.element);
        class IsDefaultCell extends wuzhui.GridViewDataCell {
            constructor(solutionListPage, dataItem) {
                super();
                this.dataField = 'IsDefault';
                this.solutionListPage = solutionListPage;
                this.dataItem = dataItem;
            }
            render(value) {
                ReactDOM.render(value != true ?
                    h("button", { className: "btn btn-minier btn-primary", ref: (e) => {
                            if (!e)
                                return;
                            ui.buttonOnClick(e, () => __awaiter(this, void 0, void 0, function* () {
                                let shopping = page.createService(shopping_1.ShoppingService);
                                let dataItem = this.dataItem;
                                let it = this.solutionListPage;
                                let result = yield shopping.setDefaultFreightSolution(dataItem.Id);
                                dataItem.IsDefault = true;
                                it.items.forEach(item => {
                                    item.IsDefault = item == dataItem;
                                    it.dataSource.updated.fire(it.dataSource, item);
                                });
                                return result;
                            }));
                        } }, "\u8BBE\u4E3A\u9ED8\u8BA4 ") :
                    h("span", null, "\u9ED8\u8BA4\u65B9\u6848"), this.element);
            }
        }
    }
    exports.default = default_1;
});
